<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <title>Image Gallery</title>
  <link rel="stylesheet" href="styles/newLayout.css" media="screen" />
</head>

<body>
  <h1>Snapshots</h1>
  <ul id="imagegallery"> 
    <!-- <li>
      <a href="images/city1.jpg" onclick="showPic(this);return false;" title="city city city">City</a>
    </li>
    <li>
      <a href="images/tree2.jpg" onclick="showPic(this);return false;" title="tree tree tree">Tree</a>
    </li>
    <li>
      <a href="images/env3.jpg" onclick="showPic(this);return false;" title="env env env">Env</a>
    </li>
    <li>
      <a href="images/car4.jpg" onclick="showPic(this);return false;" title="car car car">Car</a>
    </li>

    <li>
      <a href="images/city1.jpg" class="myshowpic" title="city city city">City</a>
    </li>
    <li>
      <a href="images/tree2.jpg" class="myshowpic" title="tree tree tree">Tree</a>
    </li>
    <li>
      <a href="images/env3.jpg" class="myshowpic" title="env env env">Env</a>
    </li>
    <li>
      <a href="images/car4.jpg" class="myshowpic" title="car car car">Car</a>
    </li> -->

    <li>
      <a href="images/city1.jpg" title="city city city">City</a>
    </li>
    <li>
      <a href="images/tree2.jpg" title="tree tree tree">Tree</a>
    </li>
    <li>
      <a href="images/env3.jpg" title="env env env">Env</a>
    </li>
    <li>
      <a href="images/car4.jpg" title="car car car">Car</a>
    </li>

  </ul>
  <img id="placeholder" src="images/placeholder.png" width="30%" alt="my image gallery" />
  <p id="description">Choose an image.</p>
  <!-- <a href="www.baidu.com" onclick="return false;">cccccccccccccccc</a> -->

  <script type="text/javascript" src="scripts/showPic.js"></script>
</body>

</html>